@extends('layouts.admin')

@section('title', '学生学籍管理')

@section('content')
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 办公 <span class="c-gray en">&gt;</span> 学生管理 <span class="c-gray en">&gt;</span> 学籍管理 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
    <div class="page-container">
        <div class="text-c"> 姓名：
            <input type="text" class="input-text" style="width:200px" placeholder="姓名" id="name" name="name">
            <input type="text" class="input-text" style="width:250px" placeholder="学籍号" id="census_no" name="census_no">
            <button type="button" class="btn btn-success radius btnSearch"><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
        </div>
        <div class="mt-20">
            <table id="listTable" class="table table-border table-bordered table-bg table-hover">
                <thead>
                    <tr class="text-c">
                        <th><input type="checkbox" name="checkList"/></th>
                        <th>姓名</th>
                        <th>学籍号</th>
                        <th>班级</th>
                        <th>创建人</th>
                        <th>创建时间</th>
                        <th>操作</th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
@endsection
@section('script')
    <script>
        var $dataTable=null;
        var $MAIN={currentPage:1}
        $(function(){
            $dataTable=$('#listTable').dataTable({
                "sPaginationType" : "full_numbers",
                "processing": true,
                "serverSide": true,
                "searching": false,
                "dom": '<l<\'#topPlugin\'>f>rt<ip><"clear">',
                "ajax":{
                    "url":"{{url('student/student/list')}}",
                    "type": 'post',
                    "data": function ( d ) {
                        d.name= $("#name").val();
                        d.census_no=$("#census_no").val();
                        d.page=$MAIN.currentPage
                    },
                    'dataSrc':function(result){
                        var datas=result.data;
                        if(datas){
                            for(var i=0;i<datas.length;i++){
                                datas[i].DT_RowClass='text-c';
                            }
                        }
                        return datas;
                    }
                },
                "columnDefs": [{
                    "targets": "_all",
                    "searchable":false
                },{
                    "targets": [-1,0],
                    "orderable":false
                }],
                "columns": [
                    {
                        "data": "id",
                        "render": function (data, type, row, meta) {
                            return '<input type="checkbox"  name="checkList" class="checkchild"  value="' + data + '" />';
                        }
                    },
                    { "data": "name"},
                    { "data": "census_no" },
                    { "data": "clbum_name" },
                    { "data": "created_user" },
                    { "data": "created_at" },
                    { "data": "id","class":"f-14","render": function (data, type, row, meta) {
                        return '<a title="编辑" href="javascript:;" data-id="'+data+'" class="ml-5 editBtn" style="text-decoration:none"><i class="Hui-iconfont">&#xe6df;</i></a>' +
                                '<a title="删除" href="javascript:;" data-id="'+data+'" class="ml-5 delBtn" style="text-decoration:none"><i class="Hui-iconfont">&#xe6e2;</i></a>';
                    }},
                ],
                drawCallback: function( settings ) {
                    $('input[name=checkList]')[0].checked=false;
                },
                "initComplete":function(settings, json){
                    var uploadImport='<span class="btn-upload">'+
                        '<form  method="post" class="form form-horizontal" id="import-form" enctype="multipart/form-data">'+
                        '<a href="javascript:void();" class="btn btn-primary radius upload=btn"><i class="Hui-iconfont">&#xe645;</i>批量导入</a>'+
                        '<input type="file" multiple="" name="file" id="file" class="input-file" style="height: 100%;width: 100%;">'+
                        '</form>'+
                        '</span>';
                    var topPlugin='<button class="btn btn-danger radius delSelectBtn"><i class="Hui-iconfont">&#xe6e2;</i> 批量删除</button> ' +
                                  '<button class="btn btn-primary radius addBtn" ><i class="Hui-iconfont">&#xe600;</i>新 增</button>'+
                                  '&nbsp;'+ uploadImport;
//                                  '<button  class="btn btn-info  btn-sm radius expCsv">导出全部</button><iframe id="exp" style="display:none;"></iframe>'
                    $("#topPlugin").append(topPlugin);
                }
            });
            $dataTable.on( 'page.dt', function () {
                var info = $dataTable.api();
                $MAIN.currentPage=parseInt(info.page())+1;
            } );
        });

        $MAIN.search=function(){
            $dataTable.api().ajax.reload();
        }
        $MAIN.getSelectCheckBoxValue=function(){
            var theArray=[];
            $("input[name=checkList]:checked").each(function() {
                theArray.push($(this).val());
            });
            return theArray;
        }
        $MAIN.deleteDatas=function(ids){
            layer.confirm('确定要删除选择学生学籍吗？',{
                    btn: ['确定','取消'],
                    shade: false,
                    closeBtn: 0
                },
                function(){
                    $.ajax({
                        url: "{{url('student/student/delete')}}",
                        data:{ids:ids},
                        dataType: 'json',
                        success: function(data){
                            if(data['successFlag']==1){
                                layer_success_message('删除成功!');
                                $MAIN.search();
                            }
                        },
                        error:function(data) {
                            layer_error_message('删除失败!');
                        },
                    });
                });
        }

        $(function(){
            $(".btnSearch").click(function(){
                $MAIN.search();
            });
            $(document).on("click",".delSelectBtn",function(){
               var ids=$MAIN.getSelectCheckBoxValue();
               if(ids.length<=0){
                   layer.msg('请选择需要删除学生学籍', {icon:5,time:1000});
               }else{
                   $MAIN.deleteDatas(ids);
               }
            });
            $(document).on("click",".addBtn",function(){
                layer_full_show("添加学生学籍",'{{url('student/student/add')}}');
            });
            $(document).on("click",".editBtn",function(){
                layer_full_show("编辑学生学籍",'{{url('student/student/edit')}}?id='+$(this).data("id"));
            });
            $(document).on("click",".delBtn",function(){
                $MAIN.deleteDatas([$(this).data("id")]);
            });
            $(document).on("change","#file",function(){
                $("#import-form").ajaxSubmit({
                    type: 'post',
                    url: "{{url('student/student/import')}}",
                    success: function(data){
                        if(data['successFlag']==1){
                            layer_success_message("添加成功!");
                            $MAIN.search();
                        }else{
                            layer_error_message(data['msg']);
                        }
                    },
                    error: function(XmlHttpRequest, textStatus, errorThrown){
                        layer_error_message('添加失败!');
                    }
                });
                $("#import-form")[0].reset();
            });
        })
    </script>
@endsection